<style>
</style>
<template>
	<div class="hand-confirm">
        <div class="scroll-x" ref="sTable">
            <div :style="{'width':widths}">
                <div :class="['confirm-main',{'module':showOrder.length > 1}]" v-for="(ksi,key) in showOrder" :key="key" >

                    <div class="el-table el-table--border ">
                        <table>
                            <colgroup>
                                <col width="40">
                                <col>
                            </colgroup>
                            <thead class="is-group">
                            <tr>
                                <th colspan="2" class="is-center"><div class="cell">科室{{key+1}}详细信息</div></th>
                            </tr>
                            </thead>
                            <tbody>
                            <tr>
                                <td class="is-center"><div class="cell">时间</div></td>
                                <td class="is-center"><div class="cell">
                                    {{showTime.day}}
                                    <div v-if="order.time != ''">{{ksi.time}}</div>
                                    <div v-else>{{showTime.time}}</div>
                                </div></td>
                            </tr>
                            <tr>
                                <td class="is-center"><div class="cell">科室</div></td>
                                <td class="is-center"><div class="cell">{{ksi.title}}</div></td>
                            </tr>
                            <tr>
                                <td class="is-center"><div class="cell">总量</div></td>
                                <td class="is-center"><div class="cell all pointer" @click="handleShowOrder(ksi)">
                                    <span class="weight">{{ksi.weight.toFixed(2)}}kg</span>
                                    <span class="line"></span>
                                    <span class="mun">{{ksi.num}}</span>
                                </div></td>
                            </tr>
                            <tr v-for="">
                                <td class="is-center"><div class="cell">分类显示</div></td>
                                <td class="is-center"><div class="cell type-item">
                                    <div v-for="(typei,typeind) in ksi.typel" :key="typeind" class="item pointer"  @click="handleShowOrder(typei)">
                                        <span :style="{background:typei.color}" class="sign">{{typei.title}}</span>
                                        <span class="weight">{{typei.weight}}kg</span>
                                        <span class="mun">{{typei.num}}</span>
                                    </div>
                                </div></td>
                            </tr>
                            </tbody>
                        </table>
                    </div>
                    <div class="">
                        <button class="el-button sure-btn" @click="handleShowConfirm(key)">确认</button>
                    </div>
                </div>
            </div>
        </div>
        
        <div class="arrow-box right-arrow" v-if="isShowTwoBtn">
            <div :class="['wrapper', isShowRightBtn ? 'can-touch' : 'no-touch']">
                <i class="el-icon-d-arrow-right arrow-rt" @click="handleMoveRight"></i>
            </div>
        </div>
        <div class="arrow-box left-arrow" v-if="isShowTwoBtn">
            <div :class="['wrapper', isShowLeftBtn ? 'can-touch' : 'no-touch']">
                <i class="el-icon-d-arrow-left arrow-lt" @click="handleMoveLeft"></i>
            </div>
        </div>

        <sign-modal 
            v-if="innerVisible"
            :innerVisible="innerVisible"
            :signType="'single'"
            :originOrder="order"
            :orders="showOrder"
            :orderInd="orderInd"
            @sure="handleSureSuccess"
            @handleCancel="hideSignModal"
        />

        <!-- <el-dialog
            width="30%"
            title=""
            top="30px"
            :visible.sync="innerVisible"
            :modal="false"
            class="confirm-pop"
        >
            <div slot="title">
                <span class="el-icon-warning"></span> 是否确认
            </div>
            <div class="con">
                {{showOrder[orderInd].title}} 医废 共 {{showOrder[orderInd].weight.toFixed(2)}}kg，{{showOrder[orderInd].num}}袋
                <br/><br/>
                <p>请填写全名(必填)</p>
                <input type="text" v-model="requiredName">
            </div>
            <div class="handle-box">
                <el-button type="info" @click="innerVisible = false">取消</el-button>
                <el-button type="primary" @click="handleSure">确认</el-button>
            </div>
        </el-dialog> -->
	</div>
</template>

<script>
    //交接1 确认
    import {confirmSignUrl} from'../../../common/ajax'
    import signModal from '../sign-modal'
	export default {
        name:'HandConfirm',
        props:{
            order:{
                type:Object,
                default:function(){
                    return {

                    }
                }
            },
            showTime:{
                type:Object,
                default:function(){
                    return {
                        day:'',
                        time:''
                    }
                }
            }
        },
		data(){
			return {
				showOrder: [],
                widths:'',
                innerVisible:false,
                orderInd:0,
                isHandle:true,
                requiredName:'',
                isShowRightBtn: true,
                isShowLeftBtn: false,
                isShowTwoBtn: false
			}
		},
        created(){
            this.handleInitShow()
            this.isShowTwoBtn = this.widths <= 700 ? false : true
        },
        watch:{
            order:function(){
                this.handleInitShow()
            }
        },
        mounted(){
            this.$refs.sTable.addEventListener('scroll', this.handleScroll, false)
        },
        methods:{
            handleSureSuccess(type,order){
                this.$emit('sure',type,order)
            },
            hideSignModal(){
                this.innerVisible = false
            },
            handleScroll(){
                this.isShowLeftBtn = this.$refs.sTable.scrollLeft == 0 ? false : true
                this.isShowRightBtn = this.$refs.sTable.scrollLeft == parseInt(this.widths) - 700 ? false : true
            },
            handleMoveLeft(){
                if(this.$refs.sTable.scrollLeft == 0) {
                    this.isShowLeftBtn = false;
                    return;
                }
                this.$refs.sTable.scrollLeft -= 100
            },
            handleMoveRight(){
                if(this.$refs.sTable.scrollLeft == parseInt(this.widths) - 700) {
                    this.isShowRightBtn = false;
                    return;
                }
                this.$refs.sTable.scrollLeft += 100
            },
            handleInitShow(){
                console.log('Comfirm pop',this.order);
                this.showOrder = []
                if(!this.order.time){
                    this.order.ks.forEach((ksObj,index)=>{
                        if(ksObj.lis.length > 0){
                            let o = {
                                title:ksObj.ks,
                                weight:ksObj.weight,
                                num:ksObj.num,
                                typel:[],
                                lis:ksObj.lis
                            }
                            this.order.types.forEach((tyval,tyind)=>{
                                let tyo = {
                                    title:tyval.title,
                                    color:tyval.color,
                                    lis:[],
                                    num:0,
                                    weight:0
                                };
                                ksObj.lis.forEach((kval,kind)=>{
                                    if(tyval.title == kval.namewc){
                                        tyo.lis.push(kval);
                                        tyo.weight += Number(kval.weight);
                                        tyo.num += Number(kval.num)
                                    }
                                })
                                if(tyo.weight > 0){
                                    tyo.weight = tyo.weight.toFixed(2)
                                }
                                if(tyo.lis.length > 0){
                                    o.typel.push(tyo)
                                }
                            })
                            this.showOrder.push(o)
                        }
                    })
                }else{
                    this.order.ks.forEach((ksObj,index)=>{
                        if(ksObj.lis.length > 0){
                            let o = {
                                title:ksObj.ks,
                                weight:0,
                                num:0,
                                typel:[],
                                lis:[],
                                time:this.order.time
                            }
                            this.order.types.forEach((tyval,tyind)=>{
                                let tyo = {
                                    title:tyval.title,
                                    color:tyval.color,
                                    lis:[],
                                    num:0,
                                    weight:0
                                };
                                ksObj.lis.forEach((kval,kind)=>{
                                    if(tyval.title == kval.namewc){
                                        if(kval.ctime.split(' ')[1] >= this.order.time.split('-')[0] && kval.ctime.split(' ')[1] <= this.order.time.split('-')[1]+':59'){
                                            tyo.lis.push(kval);
                                            tyo.weight += Number(kval.weight);
                                            tyo.num += Number(kval.num);
                                        }
                                    }
                                })
                                if(tyo.weight > 0){
                                    tyo.weight = tyo.weight.toFixed(2)
                                }
                                if(tyo.lis.length > 0){
                                    o.typel.push(tyo)
                                }
                            })
                            o.typel.forEach(v => {
                                o.weight += Number(v.weight);
                                o.num += Number(v.num)
                                v.lis.forEach(v2 => {
                                    o.lis.push(v2)
                                })
                            })
                            if(o.typel.length > 0) this.showOrder.push(o)
                        }
                    })
                }
                let len = this.showOrder.length;
                len > 2 ?
                    this.widths =  len * 360 + 'px' : this.widths = ''
            },
            handleShowOrder(val){
                this.$emit('show-order',val)
            },
            handleShowConfirm(ind){
                this.orderInd = ind
                this.innerVisible = true
            },
            handleSure(){
                if(this.requiredName.trim() == ''){
                    this.$Message({
                        showClose: true,
                        message: '填写工号或姓名才能提交',
                        type: 'error'
                    });
                    return;
                }
                if(this.isHandle){
                    this.isHandle = false;
                    let ids = {ids:[]}
                    this.showOrder[this.orderInd].lis.forEach((val,ind)=>{
                        ids.ids.push(Number(val.id))
                    })
                    let obj = {
                        step1_uinfo: this.requiredName,
                        ids: ids.ids
                    }
                    jQuery.ajax({
                        url: confirmSignUrl,
                        type: 'POST',
                        data: JSON.stringify(obj),
                        contentType: 'application/json;charset=UTF-8',
                        success: function(res){
                            this.isHandle = true;
                            if(!res.success) {
                                throwErrorTips('医废确认失败',res.msg)
                                return
                            }
                            this.innerVisible = false;
                            if(this.showOrder.length > 1){
                                this.$emit('sure',0,this.order)
                            }else {
                                this.$emit('sure',1,this.order)
                            }
                            this.$Message({
                                showClose: true,
                                message: '医废确认成功',
                                type: 'success'
                            });

                        }.bind(this),
                        error:function(res){
                            this.innerVisible = false;
                            this.isHandle = true;
                            throwErrorTips('医废确认失败',res)
                        }.bind(this)
                    })
                }
            }
        },
		components: {
            signModal
        }
	}
</script>
